<template>
  <div id="app" class="writehomework" v-if="homework.ID">
    <div class="list">
      <i-panel header-class="writehomework-panel" title="教师评价" >
      <div style="padding:5px;padding-left:20px;line-height: 26px;">{{homework.comment}}</div>
    </i-panel>
    </div>
    
    <div v-for="(itembank, i) in schoolhomeworkitembank"
      :key="i" class="list" style="display: block; padding-bottom:15px;">

   
    <i-panel
      header-class="writehomework-header"
      :title="'第'+(i+1)+'题'"
      :status="itembank.type"
      @click="visible2 = false"
    >
      <div class="html" style="padding:15rpx; height:350px;">
        <div v-html="itembank.text"></div>
      </div>
      <div>
        <div>
          <div class="text-center" v-if="itembank.type === '单选'">
            <i-button
              :type="itembank.schoolstudenthomeworkitembank[0].data.answer === vo?'info': ''"
              :round="true"
              v-for="(vo, io) in itembank.data[itembank.type]"
              :key="io"
              v-text="vo"
              custom-class="school-button-round"
            ></i-button>
          </div>
          <div class="text-center" v-else-if="itembank.type === '多选'">
            <div>
              <i-button
                :type="itembank.schoolstudenthomeworkitembank[0].data.answer[vo]?'info': ''"
                :round="true"
                v-for="(vo, io) in itembank.data[itembank.type]"
                :key="io"
                v-text="vo"
                custom-class="school-button-round"
              ></i-button>
            </div>
          </div>
        </div>
        <div class="school-class">
          <header class="school-class-header">我的答案</header>
          <div class="school-class-answer">
            <view v-if="itembank.type==='填空'">
              <span
                v-for="(vo, ins) in itembank.schoolstudenthomeworkitembank[0].data.answer"
                :key="ins"
              >{{ins+1}}.{{vo}}</span>
            </view>
            <view v-else-if="itembank.type==='多选'">
              <span
                v-for="(vo, ins) in itembank.schoolstudenthomeworkitembank[0].data.answer"
                :key="ins"
              >{{vo}}</span>
            </view>
            <view v-else v-text="itembank.schoolstudenthomeworkitembank[0].data.answer"></view>
          </div>
        </div>
        <div class="school-class">
          <header class="school-class-header">
            <i-tag size="large" type="success">正确答案</i-tag>
          </header>
          <div class="school-class-answer">
            <view v-if="itembank.type==='填空'">
              <span v-for="(vo, ins) in itembank.data.answer" :key="ins">{{ins+1}}.{{vo}}</span>
            </view>
            <view v-else-if="itembank.type==='多选'">
              <span v-for="(vo, ins) in itembank.data.answer" :key="ins">{{vo}}</span>
            </view>
            <view v-else v-text="itembank.data.answer"></view>
          </div>
        </div>
        <div class="school-class">
          <header class="school-class-header">
            <i-tag size="large" type="primary">题目解析</i-tag>
          </header>
          <div class="school-class-answer">
            <view v-text="itembank.analysis?itembank.analysis:''"></view>
          </div>
        </div>
        <div class="school-class" >
          <header class="school-class-header text-right">
            <i-icon @click.stop="handleCancel2(i)" color="#0090FF" size="26" name="chat-o" />
          </header>
        </div>
        <div class="school-class" v-if="itembank.schoolhomeworkitembankreply.length" style="background:#efefef; margin:5px; " >
          <div class="school-class-answer" >
            <div style="font-size: 13px;color:#888888;" v-for="(iv, ii) in itembank.schoolhomeworkitembankreply" :key="ii">
              <span class="school-class-student" v-if="iv.createuser==='student'">我：</span>
              <span class="school-class-teacher" v-else>老师：</span>
              {{iv.context}}
            </div>
          </div>
        </div>
      </div>
    </i-panel>
     </div>
    <div class="school-position-fixed" v-if="visible2" >
      <div class="school-position-main">
        <input cursor-spacing="7" placeholder="回复" auto-focus v-model="context" >
      </div>
      <div class="school-position-aside">
        <i-button custom-class="custom-class-small" size="small" type="info" @click="submit">发送</i-button>
      </div>
    </div>
  </div>
</template>

<script>
import a from './a'
export default a
</script>

<style scoped>
.school-position-fixed {
  position: fixed;
  bottom: 0;
  height: 50px;
  width: 100%;
  background-color: #efefef;
  left: 0;
  padding-top: 7px;
  padding-bottom: 7px;
  padding-left:10px;
  padding-right:10px;
  display: flex;
  flex-direction: row;
  flex: 1;
  flex-basis: auto;
  box-sizing: border-box;
}
.school-position-aside {
  flex-shrink: 0;
  box-sizing: border-box;
  width: 80px;
  text-align: center;
}
.school-position-aside button {
  border-radius: 4px;
}
.school-position-main {
  display: block;
  flex: 1;
  flex-basis: auto;
}
.school-position-main input {
  background: #ffffff;
  line-height: 26px;
  height: 36px;
  border-radius: 4px;
  padding-left: 3px;
  padding-right: 3px;
}

</style>

<style>
.writehomework-panel {
  font-weight: 800;
}
#app .custom-class-small {
  height: 36px;
}
</style>